<template>
    <div class="hea-1"><img src="../../public//log_img/wuzuxiu.png" alt="" style="width: 100%;"></div>
    <div class="hea-2">
        <ul class="ul-1">
            <li style="font-weight: 800;">免费模板</li>
            <li>开通会员</li>
            <li>解决方案</li>
            <li>企业服务</li>
            <li>AI创作</li>
            <li>内容平台</li>
            <li>下载APP</li>
        </ul>
    </div>
    <div class="hea-3">
        <el-button type="primary" @click="login">登录</el-button>
        <el-button type="primary">注册</el-button>
    </div>

</template>

<script setup lang="ts">
import { useRouter } from 'vue-router';

const router = useRouter()
const login = () => {
    router.replace('/login')
}

</script>

<style scoped>
.hea-1 {
    width: 20%;
    height: 100%;
}

.hea-2 {
    width: 60%;
    height: 100%;
}

.ul-1 {
    display: flex;
    width: 100%;
    height: 100%;
    justify-content: space-evenly;
    align-items: center;
}

.ul-1>li:hover {
    font-weight: 800;
    cursor: pointer;
}

.hea-3 {
    width: 20%;
    height: 100%;
    /* background-color: pink; */
    display: flex;
    justify-content: space-evenly;
}
</style>